@import '../../css/_commonx/config/theme/default'    //系统主题
@import '../../css/_commonx/config/codetheme/black'  //代码块模版
@import '../../css/_commonx/cssFunc/pages/routerconfig/routerStyle2'        //左边菜单列表模板
@import '../../css/_commondoc'                      //各系统公用部分

@import '../../css/_commonx/modules/table'        //table
@import '../../css/_commonx/css/width'        //width


@media (max-width: 768px)
  .router-container
    .demo-grid
      .ss-col
        width: calc(100% / 2)

//业务
.pages-title-sm
  font-size: $size-title-lg
  margin: 40px 0 10px;

.pages-title-lg
  color: $color-primary
  font-size: $size-title-lg
  font-weight: bold
  margin-bottom: 40px;

.demo-item-content
  border-radius: $br
  border: 1px solid $color-line-secondary
  min-height: 160px
  .item-head
    padding: var(--space, $space)
  .item-hr
    position: relative
    &:before
      content: ''
      height: 1px
      width: 100%
      background: $color-line-secondary
      display: block
    &:after
      content: attr(data-content)
      position: relative;
      top: -9px;
      background: #fff;
      padding: 0 6px;
      left: var(--space, $space)
  .pages-title
    padding: 0 var(--space, $space)

.demo-grid
  ss-func-grid('&', {$num: 5, $spacing: 10px})
  &.num2
    .ss-col
      width: calc(100% / 2)
  .caption
    font-size: $size-title-sm
    color: $color-text-title
    margin-top: 20px
  .item-box
    box-sizing: border-box
    height: 100px
    padding: 30px 15px
    border-radius: $br-lg
    color: #fff
    ss-display-flex(column, center, center)
  .item-dot-i
    font-style: normal
    display: block
    font-size: 12px

//色块
.demo-bg-primary .item-box
  background: $color-primary

.demo-bg-aux-primary .item-box
  background: $color-aux-primary
.demo-bg-aux-success .item-box
  background: $color-aux-success
.demo-bg-aux-warning .item-box
  background: $color-aux-warning
.demo-bg-aux-fail .item-box
  background: $color-aux-fail
.demo-bg-aux-info .item-box
  background: $color-aux-info


.demo-bg-text .item-box
  background: $color-text
.demo-bg-text-title .item-box
  background: $color-text-title


.demo-bg-color .item-box
  background: $color-bg
.demo-bg-color-special .item-box
  background: $color-bg-special
  
.demo-bg-border .item-box
  background: $color-line
.demo-bg-border-secondary .item-box
  background:$color-line-secondary
.demo-bg-border-input .item-box
  background:$color-line-input


.item-theme
  ss-display-flex()
  >.item
    margin-left: 10px

.icon-saui
  &:before
    content: '\e605'
    font-size: 40px

.icon-xx
  font-size: 12px
  ss-display-flex(column, center, flex-start)
  margin-bottom: 20px
  margin-right: 0
  width: 20%
  &:before
    content: '\e605'
    font-size: 36px
    color: $color-primary
    margin-bottom: 6px